{extend name="property/public/insidePageBase" /}
{block name="title"}职权部门列表{/block}
{block name="body"}
<div class="layuimini-container">
    <div class="layuimini-main">
        <div class="layui-row">
            <div class="layui-col-lg4 layui-col-md4 layui-col-sm4 layui-col-xs4">
                <div class="layui-card layui-form-pane">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <button type="submit" class="layui-btn layui-btn-primary"  lay-submit lay-filter="entrepot-btn"><i class="layui-icon"></i> 重置搜索条件</button>

                            {if $addAuth}<button type="button" class="layui-btn layui-btn-primary addUserGroup"> 添加新部门 </button>{/if}
                        </div>
                    </div>
                    <table class="layui-hide" id="propertyGroupList" lay-filter="propertyGroupList"></table>
                    <script type="text/html" id="unitTableBar">
                        <div class="layui-btn-group">
                            {if $editAuth} <a class="layui-btn layui-btn-sm layui-btn-normal" lay-event="edit">编辑</a>{/if}
                            {if $detailAuth}<a class="layui-btn layui-btn-sm" lay-event="details">详情</a>{/if}
                            {if $delAuth}<a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="delete">删除</a>{/if}
                        </div>
                    </script>
                </div>
            </div>
            <div class="layui-col-lg8 layui-col-md8 layui-col-sm8 layui-col-xs8">
                <div class="layui-card layui-form-pane">
                    <form class="layui-form" action="" lay-filter="roomForm">
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">关键字搜索</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="keywords" placeholder="请输入用户账号/手机号/姓名" autocomplete="off" class="layui-input">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <button type="submit" class="layui-btn layui-btn-primary"  lay-submit lay-filter="room-search-btn"><i class="layui-icon"></i> 搜 索</button>
                                {if $addUsersAuth} <button type="button" class="layui-btn layui-btn-primary propertyUsersAdd"> 添加管理员 </button>{/if}
                            </div>
                        </div>
                        <input type="hidden" name="group_id" value="" />
                    </form>
                    <table class="layui-hide" id="propertyUsersList" lay-filter="propertyUsersList"></table>
                    <script type="text/html" id="tableBar">
                        <div class="layui-btn-group">
                            {if $editUsersAuth} <a class="layui-btn layui-btn-sm  layui-btn-normal" lay-event="edit">编辑</a>{/if}
                            {if $detailUsersAuth}<a class="layui-btn layui-btn-sm" lay-event="details">详情</a>{/if}
                            {if $delUsersAuth}<a class="layui-btn layui-btn-sm layui-btn-danger" lay-event="delete">删除</a>{/if}
                        </div>
                    </script>
                    <script type="text/html" id="is-show-tpl">
                        <input type="checkbox" lay-skin="switch" value="{{ d.id }}" disabled  lay-filter="isShow" {{# if(d.is_show == 1) { }}checked{{# } }} lay-text="正常|禁用" />
                    </script>
                </div>
            </div>
        </div>
    </div>
</div>
{/block}
{block name="js"}
{__block__}
<script>MICROANSWER_DROPDOWAN="mDropdown";</script>
<script>
    layui.use(['form', 'table', 'mDropdown','treetable', 'dropdown'], function () {
        var $ = layui.jquery,form = layui.form,table = layui.table,treetable = layui.treetable,mDropdown = layui.mDropdown,dropdown = layui.dropdown;
        var renderTable = function() {
            treetable.render({
                elem: '#propertyGroupList',
                id:'propertyGroupList',
                treeColIndex: 1,
                treeSpid: -1,
                treeIdName: 'id',
                treePidName: 'pid',
                url: '{:url("propertyGroupList")}',
                height: 'full-48',
                page: false,
                treeDefaultClose:false,
                toolbar: false,
                where: {
                    keywords: function() {
                        return $('input[name="keywords"]').val()
                    }
                },
                cols: [[
                    {type: 'radio', width: 50, event: 'clickUnit'},
                    {field: 'name', minWidth: 168, title: '部门名称'},
                    {title: '操作', width: 168, toolbar: '#unitTableBar', fixed:'right'}
                ]],
            });
        }
        renderTable();
        // 监听搜索操作
        form.on('submit(entrepot-btn)', function (data) {
            $('input[name="group_id"]').val('');
            $('button[lay-filter="room-search-btn"]').click()
            renderTable()
            return false;
        });
        $('.addUserGroup').on('click', function() {
            var url = '{:url("propertyGroupAdd")}';
            var index = parent.layer.open({title: '添加',type: 2,shade: 0.2, maxmin:true,area: ['500px', '450px'], content: url, btnAlign: 'c' , btn: ['确定', '取消'] , yes: function (index, layero) {
                    var iframeWindow = parent.window['layui-layer-iframe' + index] , submit = layero.find('iframe').contents().find("#submitBtn");
                    iframeWindow.layui.form.on('submit(submitBtn)', function (data) {
                        var field = data.field; //获取提交的字段
                        var loadAdd = parent.layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                        $.post(url, field, function (res) {
                            parent.layer.close(loadAdd);
                            if (res.code === 0) {
                                renderTable();
                                parent.layer.close(index); //关闭弹层
                                parent.layer.msg(res.msg, {icon: 6, offset: '15px'});
                            } else {
                                parent.layer.msg(res.msg, {icon: 5, offset: '15px'});
                            }
                        });
                    });
                    submit.trigger('click');
                }
            });
        });
        $('.propertyUsersAdd').on('click', function() {
            var url = '{:url("propertyUsersAdd")}';
            var index = parent.layer.open({title: '添加管理员',type: 2,shade: 0.2, maxmin:true,area: ['850px', '500px'], content: url, btnAlign: 'c' , btn: ['确定', '取消'] , yes: function (index, layero) {
                    var iframeWindow = parent.window['layui-layer-iframe' + index] , submit = layero.find('iframe').contents().find("#submitBtn");
                    iframeWindow.layui.form.on('submit(submitBtn)', function (data) {
                        var field = data.field; //获取提交的字段
                        var loadAdd = parent.layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                        $.post(url, field, function (res) {
                            parent.layer.close(loadAdd);
                            if (res.code === 0) {
                                renderTable();
                                parent.layer.close(index); //关闭弹层
                                parent.layer.msg(res.msg, {icon: 6, offset: '15px'});
                            } else {
                                parent.layer.msg(res.msg, {icon: 5, offset: '15px'});
                            }
                        });
                    });
                    submit.trigger('click');
                }
            });
        });
        table.on('tool(propertyGroupList)', function (obj) {
            var data = obj.data;
            if (obj.event === 'clickUnit') {
                $('input[name="group_id"]').val(data.id);
                $('button[lay-filter="room-search-btn"]').click()
                obj.tr.find('input[type="radio"]').prop('checked', true);
                obj.tr.siblings().find('input[type="radio"]').prop('checked', false)
                form.render('radio');
                //标注选中样式
                obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
                return false;
            } else if (obj.event === 'edit') {
                var url = '{:url("propertyGroupEdit")}?id='+data.id;
                var index = parent.layer.open({
                    title: '编辑',type: 2,shade: 0.2,maxmin:true,area: ['500px', '450px'],content: url, btnAlign: 'c', btn: ['确定', '取消'], yes: function (index, layero) {
                        var iframeWindow = parent.window['layui-layer-iframe' + index], submit = layero.find('iframe').contents().find("#submitBtn");
                        iframeWindow.layui.form.on('submit(submitBtn)', function (data) {
                            var field = data.field; //获取提交的字段
                            var loadAdd = parent.layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                            $.post(url, field, function (res) {
                                parent.layer.close(loadAdd);
                                if (res.code === 0) {
                                    renderTable();
                                    parent.layer.close(index); //关闭弹层
                                    parent.layer.msg(res.msg, {icon: 6, offset: '15px'});
                                } else {
                                    parent.layer.msg(res.msg, {icon: 5, offset: '15px'});
                                }
                            });
                        });
                        submit.trigger('click');
                    }
                });
                return false;
            } else if (obj.event === 'details') {
                var url = '{:url("propertyGroupDetail")}?id='+data.id;
                var index = parent.layer.open({title:data.name + ' 详情 '  , type: 2, shade: 0.2, maxmin: true, shadeClose:true, move:false,area: ['1000px', '100%'],offset:  'rt', anim: 2, content: url , btn:false });
                return false;
            } else if (obj.event === 'delete') {
                var url = '{:url("propertyGroupDel")}';
                layer.confirm('删除后不可恢复！  是否确认? ', {icon: 3}, function () {
                    var loadAdd = layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                    $.post(url, {id: data.id}, function (res) {
                        layer.close(loadAdd);
                        if (res.code === 0) {
                            renderTable();
                            layer.msg(res.msg, {icon: 6, offset: '15px'});
                        } else {
                            layer.msg(res.msg, {icon: 5, offset: '15px'});
                        }
                    });
                });
            }
        });

        var tableId = 'propertyUsersList';
        table.render({
            elem: '#'+tableId,
            id:tableId,
            url: '{:url("propertyUsersList")}',
            height: 'full-90',
            toolbar: false,
            cols: [[
                {field: 'username', width: 128, title: '用户姓名', sort: true},
                {field: 'account', width: 128, title: '登录账号', sort: true},
                {field: 'mobile', width: 128, title: '手机号', sort: true},
                {field: 'full_group_name', width: 188, title: '所属部门', sort: true},
                {field: 'add_time', width: 168, title: '创建时间', sort: true},
                {field: 'status', width: 108, title: '账号状态', templet:'#is-show-tpl', sort: true, align: "center"},
                {title: '操作', minWidth: 170, toolbar: '#tableBar', fixed:'right'}
            ]],
            limits: [10, 15, 20, 25, 50, 100],
            limit: 15,
            page: true
        });

        // 监听搜索操作
        form.on('submit(room-search-btn)', function (data) {table.reload(tableId, { page: {curr: 1 } , where: data.field  }, 'data');return false; });

        table.on('tool('+tableId+')', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit') {
                var url = '{:url("propertyUsersEdit")}?id='+data.id;
                var index = layer.open({ title: '编辑管理员',   type: 2,  shade: 0.2,  maxmin:true,  area: ['850px', '500px'],  content: url , btnAlign: 'c' , btn: ['确定', '取消'] , yes: function (index, layero) {
                        var iframeWindow = window['layui-layer-iframe' + index] , submit = layero.find('iframe').contents().find("#submitBtn");
                        iframeWindow.layui.form.on('submit(submitBtn)', function (data) {
                            var field = data.field; //获取提交的字段
                            var loadAdd = layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                            $.post(url, field, function (res) {
                                layer.close(loadAdd);
                                if (res.code === 0) {
                                    table.reload(tableId); //数据刷新
                                    layer.close(index); //关闭弹层
                                    layer.msg(res.msg, {icon: 6, offset: '15px'});
                                } else {
                                    layer.msg(res.msg, {icon: 5, offset: '15px'});
                                }
                            });
                        });
                        submit.trigger('click');
                    }
                });
                $(window).on("resize", function () {
                    layer.full(index);
                });
                return false;
            } else if (obj.event === 'details') {
                var url = '{:url("propertyUsersDetail")}?id='+data.id;
                var index = parent.layer.open({title:data.username + ' 详情 '  , type: 2, shade: 0.2, maxmin: true, shadeClose:true, move:false,area: ['1000px', '100%'],offset:  'rt', anim: 2, content: url , btn:false });
                return false;
            } else if (obj.event === 'delete') {
                var url = '{:url("propertyUsersDel")}';
                layer.confirm('删除后不可恢复！  是否确认? ', {icon: 3}, function () {
                    var loadAdd = layer.msg('提交中', {icon: 16, time: 0, shade: 0.1, offset: '15px'});
                    $.post(url, {ids: [data.id]}, function (res) {
                        layer.close(loadAdd);
                        if (res.code === 0) {
                            table.reload(tableId); //数据刷新
                            layer.msg(res.msg, {icon: 6, offset: '15px'});
                        } else {
                            layer.msg(res.msg, {icon: 5, offset: '15px'});
                        }
                    });
                });
            }
        });
    });
</script>
{/block}